<template>
	<view class="main">
		<view class="hand">
			<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//dbleft.png" @click="blackbtn"></image>
		</view>
		<view class="show">
			<view class="sone">
				<view class="sonefoot">
					<view class="sfone">
						<view class="sfoneleft">
							<view class="sfoneleftfirst">{{projectName}}-{{areaName}}</view>
							<view :class="beitype=='0'?'sfoneleftsun':'sfoneleftsun1'" @click="bbtn">备注：{{marks}}</view>
							<!-- <view :class="beitype=='1'?'sfoneleftsun1':'sfoneleftsun'" @click="bbtn(1)">备注：{{this.marks}}</view> -->
						</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//up.png"
							v-if="beitype==1&&marks.length>18" @click="bbtn"></image>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//down.png"
							v-if="beitype==0&&marks.length>18" @click="bbtn"></image>
						<view class="sfoneright" @click="shuxin">
							刷新
						</view>

					</view>
					<view class="sftwo">
						<view class="sftwoleft">
							<view class="sftwotap" style="margin-bottom: 10upx;">
								<view class="sleftone">在线</view>
								<view class="stxt" v-if="areaType==0">充电桩已联网</view>
								<view class="stxt" v-if="areaType==1">充电柜已联网</view>
							</view>
							<view class="sftwotap">
								<view class="slefttwo">离线</view>
								<view class="stxt" v-if="areaType==0">充电桩已断网</view>
								<view class="stxt" v-if="areaType==1">充电柜已断网</view>
							</view>
							<view style="display: flex;margin-top: 10upx;">
								<view>
									<view class="sftwotap">
										<view class="sleftthree port0"></view>
										<view class="stxt">空闲</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port1"></view>
										<view class="stxt">充电中</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port2"></view>
										<view class="stxt">未充占用</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port3"></view>
										<view class="stxt">充满占用</view>
									</view>
								</view>

								<view style="margin-left: 50upx;">
									<view class="sftwotap">
										<view class="sleftthree port4"></view>
										<view class="stxt">端口故障</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port5"></view>
										<view class="stxt">浮充</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port88"></view>
										<view class="stxt">绑定端口</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port99"></view>
										<view class="stxt">禁用端口</view>
									</view>
								</view>
							</view>
							<view class="slzhan" @click="slbtn(1)" v-if="slshow==2">
								<view class="slzhanone">展开</view>
								<view class="slzhantwo">
									<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//down.png"></image>
								</view>
							</view>
							<view style="display: flex;" v-if="slshow==1">
								<view>
									<view class="sftwotap">
										<view class="sleftthree port6"></view>
										<view class="stxt">存储器损坏</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port7"></view>
										<view class="stxt">安全门卡住</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port8"></view>
										<view class="stxt">保险丝烧断</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port15"></view>
										<view class="stxt">刷卡芯片损坏</view>
									</view>


								</view>

								<view style="margin-left: 50upx;">
									<view class="sftwotap">
										<view class="sleftthree port9"></view>
										<view class="stxt">继电器粘连</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port10"></view>
										<view class="stxt">门磁芯片损坏</view>
									</view>
									<view class="sftwotap">
										<view class="sleftthree port13"></view>
										<view class="stxt">预检负载短路</view>
									</view>

								</view>
							</view>
							<view class="slzhan" @click="slbtn(2)" v-if="slshow==1">
								<view class="slzhanone">收起</view>
								<view class="slzhantwo">
									<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//up.png"></image>
								</view>
							</view>
						</view>
						<view class="sftworight">
							<view class="srbtn" @click="scan" v-if="deviceSettings==1">添加设备</view>
							<view class="srbtn" @click="ratebtn" v-if="deviceSettings==1">费率绑定</view>
							<!-- <view class="srbtn" @click="nameshowopen" v-if="deviceSettings==1">修改信息</view> -->
							<view class="srbtn" @click="flgo">显示费率</view>
							<view class="srbtn" @click="mjgo" style="display: none;">门禁设备</view>
							<view class="srbtn" @click="lbgo" style="display: none;">漏保主机</view>
							<view class="srbtn" @click="gdgo" v-if="deviceSettings==1">查看更多</view>
							<!-- <view class="srbtn" @click="czgo" >重置坐标</view> -->
							<!-- <view class="srbtn" style="background-color: red;" @click="delbtn" v-if="isProportion==1&&blist.length==0">删除充电区</view> -->
						</view>
					</view>
				</view>
				<view class="stwo">
					<van-cell v-for="(item, index) in blist" :key="index">
						<view class="stwotap">
							<view class="stwotaphand">
								<view class="stapleft">
									<view class="stfone" v-if="item.state=='联网'">在线</view>
									<view class="stfone1" v-if="item.state=='断网'">离线</view>
									<view class="stftwo">{{item.code}}</view>
								</view>
								<view class="dknum">
									<view v-for="(items, index) in item.dknumber" :key="index">
										<view class="sleftthree port0" v-if="items==0"></view>
										<view class="sleftthree port1" v-if="items==1"></view>
										<view class="sleftthree port2" v-if="items==2"></view>
										<view class="sleftthree port3" v-if="items==3"></view>
										<view class="sleftthree port4" v-if="items==4"></view>
										<view class="sleftthree port6" v-if="items==6"></view>
										<view class="sleftthree port7" v-if="items==7"></view>
										<view class="sleftthree port8" v-if="items==8||items==11"></view>
										<view class="sleftthree port9" v-if="items==9||items==14"></view>
										<view class="sleftthree port10" v-if="items==10"></view>
										<view class="sleftthree port5" v-if="items==5"></view>
										<view class="sleftthree port0" v-if="items==12"></view>
										<view class="sleftthree port13" v-if="items==13"></view>
										<view class="sleftthree port15" v-if="items==15"></view>
										<view class="sleftthree port88" v-if="items==88"></view>
										<view class="sleftthree port99" v-if="items==99"></view>
										<view class="sleftthree port2" v-if="items==170"></view>
									</view>
								</view>
								<view class="stapz">
									<!-- 2G | 50% -->
									<span class='color1'
										v-if='item.signals&&(item.signals>0&&item.signals<26)'>{{item.signals}}%</span>
									<span class='color2'
										v-if='item.signals&&(item.signals>25&&item.signals<51)'>{{item.signals}}%</span>
									<span class='color3'
										v-if='item.signals&&(item.signals>50&&item.signals<76)'>{{item.signals}}%</span>
									<span class='color4'
										v-if='item.signals&&(item.signals>75&&item.signals<101)'>{{item.signals}}%</span>
									| {{item.module}}
								</view>
								<view class="stapright">
									<!-- <image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//look.png" class="imgone" @click="xqshowopen(item.id,item.deviceId,item.portState)"></image> -->
									<view class="imgone"
										@click="xqshowopen(item.id,item.deviceId,item.portState,item.dknumber1)">详情
									</view>
									<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//tapdel.png" class="imgtwo"
										@click="detailnum(item.id)"></image>
								</view>
							</view>
							<view class="stwotapfoot">
								<view style='width:26%;'>当前温度:{{item.sidetemp}}</view>
								<view style="width: 23%;">
									<view class="dno" @click="dnobtn(item.deviceId)"
										v-if="item.deviceId.substring(item.deviceId.length - 2, item.deviceId.length)=='05'||item.deviceId.substring(item.deviceId.length - 2, item.deviceId.length)=='06'||item.deviceId.substring(item.deviceId.length - 2, item.deviceId.length)=='07'">
										端口码管理</view>
								</view>

								<view style="width: 27%;">
									<view v-if="item.strengthStr!=100&&item.strengthStr!='无'">

										<span class='color1'
											v-if='item.strengthStr>0&&(item.strengthStr<25||item.strengthStr==25)'>{{item.strengthStr}}%</span>
										<span class='color2'
											v-if='item.strengthStr>25&&(item.strengthStr<50||item.strengthStr==50)'>{{item.strengthStr}}%</span>
										<span class='color3'
											v-if='item.strengthStr>50&&(item.strengthStr<75||item.strengthStr==75)'>{{item.strengthStr}}%</span>
										<span class='color4'
											v-if='item.strengthStr>75&&(item.strengthStr<100||item.strengthStr==100)'>{{item.strengthStr}}%</span>
										| LORA
									</view>
									<view v-if="item.netType!=0">
										|<span class='color5' v-if='item.netType==2'>FSK(主)</span>
										<span class='color6' v-if='item.netType==1'>FSK(分)</span>
									</view>
								</view>

								<view class="dno" @click="uprem(item.id,item.remark)">
									修改备注
								</view>
							</view>
							<view class="stwotapfoot" v-if="item.remark">
								<view>备注：{{item.remark}}</view>
							</view>
							<view class="dktap" v-if="item.dknumber1">
								<view>柜门状态:</view>
								<view class="dknum1">
									<view v-for="(item, index) in item.dknumber1" :key="index">
										<view class="sleftthree port0" v-if="item==0&&item!=''"></view>
										<view class="sleftthree port4" v-if="item==1"></view>

									</view>

								</view>
							</view>
							<view class="zuwang" v-if="item.netType==2&&item.netIsSuc==0">
								<view class="zwone" @click="zwbtn(item.id)">组网</view>
							</view>

						</view>

					</van-cell>
				</view>
			</view>

			<!-- //设备详情弹窗提示 -->
			<van-popup :show="xqshow">
				<view class="tannei">
					<view class="tnhand">
						<view class="tntxt">设备详情</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="xqshowclose"></image>
					</view>
					<view class="tnshow">
						<view>主机信息</view>
						<view class="tnshowone" @click="shuabtn" v-if="Verification">刷新</view>
						<view class="tnshowone1" v-if="!Verification">{{timer}}s</view>
					</view>
					<view class="tnfoot">
						<view class="tntap" v-if="host.simCodes">
							<view class="tntapleft" style="width: 100upx;">sim号:</view>
							<view class="tntaoright">{{host.simCodes}}</view>
						</view>
						<view class="tntap" v-if="host.hostType">
							<view class="tntapleft">主机类型:</view>
							<view class="tntaoright">{{host.hostType}}</view>
						</view>
						<view class="tntap" v-if="host.version">
							<view class="tntapleft">固件版本:</view>
							<view class="tntaoright">{{host.version}}</view>
						</view>
						<view class="tntap" v-if="host.packageName">
							<view class="tntapleft">套餐名称:</view>
							<view class="tntaoright">{{host.packageName}}</view>
						</view>
						<view class="tntap" v-if="host.netFrequency">
							<view class="tntapleft">无线频率:</view>
							<view class="tntaoright">{{host.netFrequency}}</view>
						</view>
						<view class="tntap" v-if="host.state">
							<view class="tntapleft">卡状态:</view>
							<view class="tntaoright tcolor00" v-if="host.state=='00'">正常</view>
							<view class="tntaoright tcolor0" v-if="host.state=='0'">未知</view>
							<view class="tntaoright tcolor88" v-if="host.state=='01'">单向停机</view>
							<view class="tntaoright tcolor88" v-if="host.state=='02'">停机</view>
							<view class="tntaoright" v-if="host.state=='03'">预销号</view>
							<view class="tntaoright tcolor99" v-if="host.state=='04'">销号/拆机</view>
							<view class="tntaoright" v-if="host.state=='05'">过户</view>
							<view class="tntaoright" v-if="host.state=='06'">休眠</view>
							<view class="tntaoright" v-if="host.state=='07'">待机</view>
							<view class="tntaoright" v-if="host.state=='08'">已停用</view>
							<view class="tntaoright" v-if="host.state=='09'">库存</view>
							<view class="tntaoright" v-if="host.state=='10'">已失效</view>
							<view class="tntaoright" v-if="host.state=='11'">违章停机</view>
							<view class="tntaoright" v-if="host.state=='12'">挂失</view>
							<view class="tntaoright" v-if="host.state=='13'">用户报停</view>
							<view class="tntaoright" v-if="host.state=='14'">断网</view>
							<view class="tntaoright tcolor88" v-if="host.state=='77'">待复机</view>
							<view class="tntaoright tcolor88" v-if="host.state=='88'">待停机</view>
							<view class="tntaoright tcolor99" v-if="host.state=='99'">不存在</view>
						</view>
						<view class="tntap" v-if="host.activeTime">
							<view class="tntapleft">激活时间:</view>
							<view class="tntaoright">{{host.activeTime}}</view>
						</view>
						<view class="tntap" v-if="host.expireTime">
							<view class="tntapleft">过期时间:</view>
							<view class="tntaoright">{{host.expireTime}}</view>
						</view>
						<view class="tntap" v-if="host.useFlow">
							<view class="tntapleft" style="width: 300upx;">本月已用流量（MB）:</view>
							<view class="tntaoright">{{host.useFlow}}</view>
						</view>
					</view>
					<view class="tnshow">从机信息</view>
					<view class="tnfoot">
						<view class="tntap" v-if="equipment.deviceType">
							<view class="tntapleft">设备类型:</view>
							<view class="tntaoright">{{equipment.deviceType}}</view>
						</view>
						<view class="tntap" v-if="equipment.version">
							<view class="tntapleft">固件版本号:</view>
							<view class="tntaoright">{{equipment.version}}</view>
						</view>
						<view class="tntap" v-if="equipment.boardVersion">
							<view class="tntapleft">电源版本号:</view>
							<view class="tntaoright">{{equipment.boardVersion}}</view>
						</view>
						<view class="tntap" v-if="equipment.voltage">
							<view class="tntapleft">电压:</view>
							<view class="tntaoright">{{equipment.voltage}}</view>
						</view>
						<view class="tntap" v-if="equipment.longTim">
							<view class="tntapleft">最大充电时长:</view>
							<view class="tntaoright">{{equipment.longTime}}小时</view>
						</view>
						<view class="tntap" v-if="equipment.longPower">
							<view class="tntapleft">最大充电功率:</view>
							<view class="tntaoright">{{equipment.longPower}}瓦</view>
						</view>
						<view class="tntap" v-if="equipment.time">
							<view class="tntapleft" style="width: 250upx;">设备最后联网时间:</view>
							<view class="tntaoright">{{equipment.time}}</view>
						</view>
					</view>

					<van-tabs v-model="active">
						<van-tab title="设备端口" name="a">
							<!-- <view class="tnshow">设备端口</view> -->
							<view style="font-size: 28upx;color: red;margin-left: 18upx;">1.每次通电将在一分钟后自动断电</view>
							<view style="font-size: 28upx;color: red;margin-left: 18upx;">2.此操作不影响正常订单</view>
							<view style="font-size: 28upx;color: red;margin-left: 18upx;">3.请勿给正常充电的端口结束充电</view>
							<view class="cdk">
								<view v-for="(item, index) in celist" :key="index" @click="cdkbtn(item.numname)">
									<view :class="item.btn=='0'?'cdkwai port0':'cdkwai1 port0'"
										v-if="item.numtype==0||item.numtype==12">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port1':'cdkwai1 port1'" v-if="item.numtype==1">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port2':'cdkwai1 port2'" v-if="item.numtype==2">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port3':'cdkwai1 port3'" v-if="item.numtype==3">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port4':'cdkwai1 port4'" v-if="item.numtype==4">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port5':'cdkwai1 port5'" v-if="item.numtype==5">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port6':'cdkwai1 port6'" v-if="item.numtype==6">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port7':'cdkwai1 port7'" v-if="item.numtype==7">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port8':'cdkwai1 port8'"
										v-if="item.numtype==8||item.numtype==11">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port9':'cdkwai1 port9'"
										v-if="item.numtype==9||item.numtype==14">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port10':'cdkwai1 port10'"
										v-if="item.numtype==10">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port13':'cdkwai1 port13'"
										v-if="item.numtype==13">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port15':'cdkwai1 port15'"
										v-if="item.numtype==15">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port88':'cdkwai1 port88'"
										v-if="item.numtype==88">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port99':'cdkwai1 port99'"
										v-if="item.numtype==99">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port2':'cdkwai1 port2'"
										v-if="item.numtype==170">
										{{item.numname}}
									</view>
								</view>
							</view>
						</van-tab>
						<van-tab title="设备柜门" v-if="doorState" name="b">
							<view style="font-size: 28upx;color: red;margin-left: 18upx;">
								1.强制打开柜门后，设备下发开门指令，订单结束，订单结束原因为强制打开柜门。</view>
							<view class="cdk">
								<view v-for="(item, index) in celist" :key="index" @click="cdkbtn(item.numname)">
									<view :class="item.btn=='0'?'cdkwai port0':'cdkwai1 port0'"
										v-if="item.numtype==0||item.numtype==12">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port1':'cdkwai1 port1'" v-if="item.numtype==1">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port2':'cdkwai1 port2'" v-if="item.numtype==2">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port3':'cdkwai1 port3'" v-if="item.numtype==3">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port4':'cdkwai1 port4'" v-if="item.numtype==4">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port5':'cdkwai1 port5'" v-if="item.numtype==5">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port6':'cdkwai1 port6'" v-if="item.numtype==6">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port7':'cdkwai1 port7'" v-if="item.numtype==7">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port8':'cdkwai1 port8'"
										v-if="item.numtype==8||item.numtype==11">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port9':'cdkwai1 port9'"
										v-if="item.numtype==9||item.numtype==14">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port10':'cdkwai1 port10'"
										v-if="item.numtype==10">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port13':'cdkwai1 port13'"
										v-if="item.numtype==13">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port15':'cdkwai1 port15'"
										v-if="item.numtype==15">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port88':'cdkwai1 port88'"
										v-if="item.numtype==88">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port99':'cdkwai1 port99'"
										v-if="item.numtype==99">
										{{item.numname}}
									</view>
									<view :class="item.btn=='0'?'cdkwai port2':'cdkwai1 port2'"
										v-if="item.numtype==170">
										{{item.numname}}
									</view>
								</view>
							</view>
						</van-tab>
					</van-tabs>

					<view class="cdkkat" v-if="active === 'a'">
						<view :class="atype==0?'cdkkatone':'cdkkatone1'" @click="cdkopen">
							测试通电
						</view>
						<view :class="btype==0?'cdkkattwo':'cdkkattwo1'" @click="cdkclose">
							结束通电
						</view>
					</view>
					<view class="cdkkat" v-if="active === 'b'">
						<van-button class="cdkkattwo" style="padding: unset; font-size: 16px;" :disabled="!tdnum"
							color="#910012" @click="showDialog = true">强制开门</van-button>
					</view>

				</view>
			</van-popup>
			<!-- //查看更多 -->
			<van-popup :show="gdshow">
				<view class="tannei">
					<view class="tnhand">
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="gdshowclose"></image>
					</view>
					<view class="gdtype">
						<view class="gdshowbtn" @click="czgo">
							清除坐标
						</view>
						<view class="gdshowbtn" @click="nameshowopen">
							修改信息
						</view>
					</view>
				</view>
			</van-popup>
			<!-- //参数设置弹窗提示 -->
			<van-popup :show="cshow">
				<view class="tannei">
					<view class="tnhand">
						<view class="tntxt">参数设置</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="cshowclose"></image>
					</view>
					<view class="tnone">
						<view class="tnonetap">
							<view class="toneleft">
								最大充电功率
							</view>
							<input placeholder="如：1瓦" v-model="longPower" />
						</view>
						<view class="tnonetap">
							<view class="toneleft">
								最大充电时长
							</view>
							<input placeholder="如：1小时" v-model="longTime" />
						</view>
					</view>
					<view class="tntwo" @click="csbtn">确认提交</view>
				</view>
			</van-popup>
			<!-- //修改名称弹窗提示 -->
			<van-popup :show="nameshow">
				<view class="tannei">
					<view class="tnhand">
						<view class="tntxt">修改信息</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="nameshowclose">
						</image>
					</view>
					<view class="tnone">
						<view class="tnoneshow">
							<view class="tnonetxt">充电区名：</view>
							<input placeholder="请输入新名称" v-model="name" />
						</view>
						<view class="tnoneshow">
							<view class="tnonetxt">备注：</view>
							<textarea placeholder="请输入新备注" v-model="marks1" maxlength="50" />
						</view>
					</view>
					<view class="tntwo" @click="namebtn">确认提交</view>
				</view>
			</van-popup>
			<!-- //修改备注弹窗提示 -->
			<van-popup :show="remshow">
				<view class="tannei">
					<view class="tnhand">
						<view class="tntxt">修改备注</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="remshowclose">
						</image>
					</view>
					<view class="tnone">
						<view class="tnoneshow">
							<view class="tnonetxt">备注：</view>
							<textarea placeholder="请输入备注" v-model="upremarks" maxlength="10" />
						</view>
					</view>
					<view class="tntwo" @click="rembtn">确认提交</view>
				</view>
			</van-popup>
			<!-- 费率显示 -->
			<van-popup :show="feilv">
				<view class="sfour">
					<view class="stwohand">
						费率详情<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="showclose">
						</image>
					</view>
					<view class="stwofoot">

						<view class="sftwo">
							<view class="sftwofoot" v-if="monthlyList.length>0">
								<view class="montleft">
									包月：
								</view>
								<view class="montright">
									<view class="montone" v-for="(item, index) in monthlyList" :key="index">
										<view v-if="item.types=='A1'">
											<view>{{item.standard}}元/{{item.num}}小时/月</view>
										</view>
										<view v-if="item.types=='A3'">
											<view>
												{{item.standard}}元/{{item.num}}次/月
											</view>
										</view>
										<view v-if="item.types=='A4'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/月(共{{item.num}}小时)
											</view>
											<view v-if="item.minPower==item.maxPower">
												{{item.maxPower}}瓦以上{{item.standard}}元/月(共{{item.num}}小时)
											</view>
										</view>
										<view v-if="item.types=='A6'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/月(共{{item.num}}次)
											</view>
											<view v-if="item.minPower==item.maxPower">
												{{item.maxPower}}瓦以上{{item.standard}}元/月(共{{item.num}}次)
											</view>
										</view>
										<view v-if="item.types=='A5'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/月({{item.num}}小时/天)
											</view>
											<view v-if="item.minPower==item.maxPower">
												{{item.maxPower}}瓦以上{{item.standard}}元/月({{item.num}}小时/天)
											</view>
										</view>
										<view v-if="item.types=='A7'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/月({{item.num}}次/天)
											</view>
											<view v-if="item.minPower==item.maxPower">
												{{item.maxPower}}瓦以上{{item.standard}}元/月({{item.num}}次/天)
											</view>
										</view>
									</view>
									<view class="montone" v-if="oneremarks">
										备注:{{oneremarks}}
									</view>
									<view class="montone">
										允许同时充电次数:{{limitNum}}
									</view>
									<view class="montone" v-if="areaType==1">占位费免费时长(小时):{{monthlyOccupyFree/60}}</view>
									<!-- <view>占位费封顶金额:￥{{monthlyOccupyMax}}元</view> -->
									<view class="montone" v-if="areaType==1">占位费率:{{monthlyOccupyRate}}</view>

								</view>
							</view>
							<view class="sftwofoot" v-if="oftenList.length>0">
								<view class="montleft">
									常用：
								</view>
								<view class="montright">
									<view class="montone" v-for="(item, index) in oftenList" :key="index">
										<view v-if="item.types=='B2'">
											电费:{{item.standard}}元/度
										</view>
										<view v-if="item.types=='B5'">
											电费:{{item.standard}}元/度
										</view>
										<view v-if="item.types=='B1'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}} ~ {{item.maxPower}}瓦- {{item.standard}}元/小时
											</view>
											<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上-
												{{item.standard}}元/小时</view>
										</view>
										<view v-if="item.types=='B3'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}} ~ {{item.maxPower}}瓦- {{item.standard}}元/次
											</view>
											<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上-
												{{item.standard}}元/次</view>
										</view>
										<view v-if="item.types=='B4'">
											<view v-if="item.minPower!=item.maxPower">
												{{item.minPower}} ~ {{item.maxPower}}瓦- 1元/{{item.standard}}小时
											</view>
											<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上-
												1元/{{item.standard}}小时</view>
										</view>

									</view>
									<view class="montone">
										最低消费:{{oftenminMoney}}元
									</view>
									<view class="montone" v-if="oftentypes=='B2'">
										电损率:{{oftenlossRate}}
									</view>
									<view class="montone" v-if="tworemarks">
										备注:{{tworemarks}}
									</view>
									<view class="montone" v-if="oftentypes=='B2'&&twonum">
										服务费:{{twonum}}元/小时
									</view>
									<view class="montone" v-if="oftentypes=='B5'&&twonum">
										服务费:{{twonum}}元/度
									</view>
									<view class="montone" v-if="areaType==1">占位费免费时长(小时):{{oftenOccupyFree/60}}</view>
									<view class="montone" v-if="areaType==1">占位费封顶金额:￥{{oftenOccupyMax}}元</view>
									<view class="montone" v-if="areaType==1">占位费率:{{oftenOccupyRate}}</view>
								</view>
							</view>
							<view class="sftwofoot" v-if="temporaryList.length>0">
								<view class="montleft">
									临时：
								</view>
								<view class="montright">
									<view class="montone" v-for="(item, index) in temporaryList" :key="index">
										<view v-if="item.minPower!=item.maxPower">{{item.minPower}} ~
											{{item.maxPower}}瓦- {{item.standard}}元/时</view>
										<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上-
											{{item.standard}}元/时</view>
									</view>
									<view class="montone">
										允许退费:<span v-if="isFund==0">不允许</span><span v-if="isFund==1">允许</span>
									</view>
									<view class="montone">
										最低消费:{{lsminMoney}}元
									</view>
									<view class="montone">
										临时金额:{{first}}元/{{second}}元/{{third}}元/{{fourth}}元
									</view>
									<view class="montone" v-if="threeremarks">
										备注:{{threeremarks}}
									</view>
									<view class="montone" v-if="areaType==1">占位费免费时长(小时):{{temporaryOccupyFree/60}}
									</view>
									<view class="montone" v-if="areaType==1">占位费封顶金额:￥{{temporaryOccupyMax}}元</view>
									<view class="montone" v-if="areaType==1">占位费率:{{temporaryOccupyRate}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</van-popup>

			<!-- 带计时器的弹窗 -->
			<time-dialog :show.sync="showDialog" @sure="forcedOpening"></time-dialog>
		</view>
	</view>
</template>

<script>
	// import wx from "../../common/jweixin-module/index.js"
	import timeDialog from '@/components/timer-dialog/index.vue'
	// import { Dialog } from 'vant';
	export default {
		components: {
			timeDialog
		},
		mounted() {

		},

		data() {
			return {
				doorState: null,
				showDialog: false,
				active: 'a',
				xqshow: false, //设备详情弹窗
				cshow: false, //参数设置弹窗
				nameshow: false, //修改名称弹窗
				areaId: '', //充电区ID
				projectId: '',
				name: '', //名称
				marks: '', //备注
				marks1: '', //备注
				longPower: '', //最大充电功率
				longTime: '', //最大充电时间
				blist: [], //设备列表
				loading: false,
				finished: false,
				refreshing: false,
				pageNum: 1, //页码
				pageSize: 10, //每页显示的条数
				host: {}, //主机信息
				equipment: {}, //设备信息
				deviceId: '', //设备编号
				isProportion: '',
				deviceSettings: 0,
				monthlyList: [], //包月数据
				oftenList: [], //常用数据
				temporaryList: [], //临时数据
				feilv: false, //费率显示
				firstone: false,
				oftenminMoney: '', //常用最低消费
				oftenlossRate: '', //常用电损率
				twonum: '', //服务费
				oftentypes: '',
				isFund: '', //是否允许退费
				lsminMoney: '', //临时最低消费
				first: '',
				second: '',
				third: '',
				fourth: '',
				oneremarks: '', //包月备注
				tworemarks: '', //常用备注
				threeremarks: '', //临时备注
				projectName: '', //小区名
				areaName: '', //充电区名
				beitype: 0, //备注信息展开
				gdshow: false,
				limitNum: 1, //允许同时充电次数
				addNew: 0,
				slshow: 2,
				areaType: 0, //0充电桩   1充电柜
				oftenOccupyFree: 0, //常用免费时长-小时（充电柜）
				oftenOccupyMax: 0, //常用占位费封顶金额
				oftenOccupyRate: 0, //常用占位费率（充电柜）
				temporaryOccupyFree: 0, //临时免费时长-小时（充电柜）
				temporaryOccupyMax: 0, //临时占位费封顶金额
				temporaryOccupyRate: 0, //临时占位费率（充电柜）
				monthlyOccupyFree: 0, //包月免费时长-小时（充电柜）
				monthlyOccupyMax: 0, //包月占位费封顶金额
				monthlyOccupyRate: 0, //包月占位费率（充电柜）
				sbdeviceId: '', //刷新 16位设备号
				sbid: '', //刷新设备id
				Verification: true, //通过v-if控制显示获取还是倒计时
				timer: 3,
				remshow: false, //修改备注弹窗
				remid: '', //设备id
				upremarks: '', //修改设备备注
				celist: '', //测试上电端口列表
				tdnum: '', //测试通电端口号
				atype: 0,
				btype: 0,
			}
		},
		onShow() {
			this.firstone = false
		},
		onLoad(options) {
			this.projectId = options.projectId
			this.areaId = options.id
			this.marks = options.marks
			this.marks1 = options.marks
			this.isProportion = options.isProportion
			this.deviceSettings = options.deviceSettings
			this.projectName = options.projectName
			this.areaName = options.areaName
			this.name = options.areaName
			this.addNew = options.addNew
			this.areaType = options.areaType
			this.onRefresh();
		},
		methods: {
			// 强制开门
			forcedOpening() {
				let data = {
					port: this.tdnum,
					deviceId: this.sbdeviceId
				}
				this.$base.request1('manager/equipment/openDoor', 'POST', data)
					.then(res => {
						if (res.data.code == '200') {
							uni.showToast({
								title: '强制开门成功',
								duration: 2000,
							});
							return
						}
						uni.showToast({
							title: res.data.msg,
							duration: 2000,
							icon: "error"
						});
					})
			},
			//返回上一页
			blackbtn() {
				uni.navigateBack()
			},
			//关闭设备详情弹窗
			xqshowclose() {
				this.xqshow = false
			},
			slbtn(type) {
				this.slshow = type
			},
			//打开设备详情弹窗
			xqshowopen(id, deviceId, portState, dknumber1) {
				console.log(dknumber1, 'dknumber1=======');
				this.doorState = dknumber1
				this.sbid = id
				this.sbdeviceId = deviceId
				this.xqshow = true
				// 初始化选中端口
				this.tdnum = ''
				this.$base.request1('manager/equipment' + '/' + id, 'GET')
					.then(res => {
						this.host = {}
						this.equipment = {}
						if (res.data.data.host) {
							this.host = res.data.data.host[0]
						}
						if (res.data.data.equipment) {
							this.equipment = res.data.data.equipment[0]
						}
					})
					.catch(err => {

					})
				this.celist = portState.split(',')
				var klist = []
				for (var i = 0; i < this.celist.length; i++) {
					var dk = {}
					dk.numname = i + 1
					dk.numtype = this.celist[i]
					dk.btn = 0
					klist.push(dk)
				}
				this.celist = klist
			},
			cdkbtn(numname) {
				this.tdnum = numname
				for (var i = 0; i < this.celist.length; i++) {
					if (numname == this.celist[i].numname) {
						this.celist[i].btn = 1
					} else {
						this.celist[i].btn = 0
					}
				}
			},
			//设备端口测试通电
			cdkopen() {
				if (this.atype == 0) {
					if (!this.tdnum) {
						this.$toast.fail('请选择端口')
						return
					}
					let data = {
						port: this.tdnum,
						deviceId: this.sbdeviceId,
						control: '01'
					}
					this.atype = 1
					this.$base.request('charge/testCharge', 'POST', data)
						.then(res => {
							if (res.data.code == '200') {
								uni.showToast({
									title: '操作成功',
									duration: 2000,
								});
								setTimeout(() => {
									this.atype = 0
								}, 2000)
							} else {
								uni.showToast({
									title: res.data.msg,
									duration: 2000,
									icon: "error"
								});
							}
						})
						.catch(err => {

						})
				}

			},
			//设备端口结束通电
			cdkclose() {
				let that = this;
				if (that.btype == 0) {
					if (!that.tdnum) {
						uni.showToast({
							title: '请选择端口',
							duration: 2000,
							icon: "error"
						});
						return
					}
					let data = {
						port: that.tdnum,
						deviceId: that.sbdeviceId,
						control: '00'
					}
					uni.showModal({
						title: '提示',
						content: '请注意当前停止设备是否有用户正在使用，确认继续操作？',
						success: function(res2) {
							if (res2.confirm) {
								that.btype = 1
								that.$base.request('charge/testCharge', 'POST', data)
									.then(res => {
										if (res.data.code == '200') {
											uni.showToast({
												title: '操作成功',
												duration: 2000,
											});
											setTimeout(() => {
												that.btype = 0
											}, 2000)

										} else {
											uni.showToast({
												title: res.data.msg,
												duration: 2000,
												icon: "error"
											});
										}
									})
									.catch(err => {

									})
							} else if (res2.cancel) {
								console.log('用户点击取消');
							}
						}
					});

				}

			},
			//费率数据
			flshow() {
				this.$base.request1('manager/area' + '/' + this.areaId, 'GET')
					.then(res => {
						if (res.data.code == 200) {
							var item = res.data.data
							if (item.monthlyList) {
								if (item.monthlyList.length > 0) {
									this.monthlyList = item.monthlyList
									this.oneremarks = item.monthlyList[0].remarks
									this.limitNum = item.monthlyList[0].limitNum
									this.monthlyOccupyFree = item.monthlyList[0].occupyFree
									this.monthlyOccupyMax = item.monthlyList[0].occupyMax
									this.monthlyOccupyRate = item.monthlyList[0].occupyRate
								} else {
									this.monthlyList = []
								}
							} else {
								this.monthlyList = []
							}
							if (item.oftenList) {
								if (item.oftenList.length > 0) {
									this.oftenList = item.oftenList
									this.oftenminMoney = item.oftenList[0].minMoney
									this.oftenlossRate = item.oftenList[0].lossRate
									this.twonum = item.oftenList[0].num / 100
									this.oftentypes = item.oftenList[0].types
									this.tworemarks = item.oftenList[0].remarks

									this.oftenOccupyFree = item.oftenList[0].occupyFree
									this.oftenOccupyMax = item.oftenList[0].occupyMax
									this.oftenOccupyRate = item.oftenList[0].occupyRate
								} else {
									this.oftenList = []
								}
							} else {
								this.oftenList = []
							}
							if (item.temporaryList) {
								if (item.temporaryList.length > 0) {
									this.temporaryList = item.temporaryList
									this.isFund = item.temporaryList[0].isFund
									this.lsminMoney = item.temporaryList[0].minMoney
									this.first = item.temporaryList[0].first
									this.second = item.temporaryList[0].second
									this.third = item.temporaryList[0].third
									this.fourth = item.temporaryList[0].fourth
									this.threeremarks = item.temporaryList[0].remarks

									this.temporaryOccupyFree = item.temporaryList[0].occupyFree
									this.temporaryOccupyMax = item.temporaryList[0].occupyMax
									this.temporaryOccupyRate = item.temporaryList[0].occupyRate
								} else {
									this.temporaryList = []
								}
							} else {
								this.temporaryList = []
							}

						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
						}
					})
					.catch(err => {

					})
			},
			//关闭参数设置弹窗
			cshowclose() {
				this.cshow = false
			},
			//打开参数设置弹窗
			cshowopen() {
				this.cshow = true
			},
			//关闭修改名称弹窗
			nameshowclose() {
				this.nameshow = false
			},
			//关闭修改备注弹窗
			remshowclose() {
				this.remshow = false
			},
			//打开修改名称弹窗
			nameshowopen() {
				this.gdshow = false
				this.nameshow = true
			},
			//打开更多
			gdgo() {
				this.gdshow = true
			},
			//关闭更多
			gdshowclose() {
				this.gdshow = false
			},
			//费率显示
			flgo() {
				if (!this.firstone) {
					this.firstone = true
					this.flshow();
				}
				this.feilv = true
			},
			//跳转漏保主机
			lbgo() {
				uni.navigateTo({
					url: '/manager_pages/Failsafe_host/Failsafe_host?projectId=' + this.projectId + '&id=' + this
						.areaId + '&isProportion=' + this.isProportion + '&deviceSettings=' + this.deviceSettings +
						'&areaName=' + this.areaName + '&projectName=' + this.projectName + '&marks=' + this.marks,
				});
			},
			//跳转添加充电区
			addbtn() {
				uni.navigateTo({
					url: '/manager_pages/add_charging_area/add_charging_area',
				});

			},
			//跳转费率绑定
			ratebtn() {
				uni.navigateTo({
					url: '/manager_pages/rate_binding/rate_binding?projectId=' + this.projectId + '&areaId=' + this
						.areaId + '&addNew=' + this.addNew + '&areaType=' + this.areaType + '&isProportion=' + this
						.isProportion,
				});
			},
			mjgo() {
				uni.navigateTo({
					url: '/manager_pages/access_control_equipment/access_control_equipment?areaId=' + this.areaId +
						'&projectName=' + this.projectName + '&areaName=' + this.areaName + '&marks=' + this
						.marks + '&marks1=' + this.marks1
				});
			},
			//修改名称提交
			namebtn() {
				let data = {
					name: this.name,
					marks: this.marks1
				}
				this.$base.request1('manager/area' + '/' + this.areaId, 'PUT', data)
					.then(res => {
						if (res.data.code == '200') {
							uni.setStorageSync('typetwo', 1)
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
							});
							// uni.navigateBack()
							this.areaName = this.name
							this.marks = this.marks1
							this.nameshow = false
						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
						}
					})
					.catch(err => {

					})
			},
			//删除设备
			detailnum(id) {
				if (this.deviceSettings == '1') {
					uni.showModal({
						title: '提示',
						content: '确认删除？',
						success: function(res2) {
							if (res2.confirm) {
								this.$base.request1('manager/equipment' + '/' + id, 'DELETE')
									.then(res => {
										if (res.data.code == '200') {
											uni.showToast({
												title: res.data.msg,
												duration: 2000,
											});
											this.blist = [];
											this.onRefresh();
										} else {
											uni.showToast({
												title: res.data.msg,
												duration: 2000,
												icon: "error"
											});
										}
									})
									.catch(err => {

									})
							} else if (res2.cancel) {
								console.log('用户点击取消');
							}
						}
					});

				} else {
					uni.showToast({
						title: '您暂无权限',
						duration: 2000,
						icon: "error"
					});
					return
				}
			},
			//修改极限参数
			csbtn() {
				let data = {
					longTime: this.longTime,
					longPower: this.longPower
				}
				this.$base.request('manager/area/limit' + '/' + this.areaId, 'PUT', data)
					.then(res => {
						if (res.data.code == '200') {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
							});

							uni.navigateBack()
						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
						}
					})
					.catch(err => {

					})
			},
			//添加设备
			scan() {
				if (this.deviceSettings == '1') {
					let _this = this;
					uni.scanCode({
						scanType: ['qrCode', 'barCode'],
						success: function(res) {
							console.log('条码类型：' + res.scanType);
							console.log('条码内容：' + res.result);
							var str = res.result;
							var dk = str.split('/')
							console.log('端口号：', dk[4])
							
							var no = Number(dk.length) - 2
							if (_this.areaType == 0) {
								if (dk[no].substr(-2, 1) != 9) {
									_this.deviceId = dk[no]
									_this.jkbtn();
								} else {
									uni.showToast({
										title: '充电柜设备请在充电柜充电区添加',
										duration: 2000,
										icon: "error"
									});
									return
								}
							} else {
								if (dk[no].substr(-2, 1) != 9) {
									uni.showToast({
										title: '充电柜充电区只能添加充电柜设备',
										duration: 2000,
										icon: "error"
									});
									return
								} else {
									_this.deviceId = dk[no]
									_this.jkbtn();
								}
							}
						}
					});

				} else {
					uni.showToast({
						title: '您暂无权限',
						duration: 2000,
						icon: "error"
					});
					return
				}
			},
			jkbtn() {
				let data = {
					deviceId: this.deviceId,
					areaId: this.areaId
				}
				this.$base.request1('manager/equipment', 'POST', data)
					.then(res => {
						if (res.data.code == '200') {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
							});
							this.blist = [];
							this.onRefresh();
						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
						}
					})
					.catch(err => {

					})
			},
			//刷新
			shuxin() {
				this.blist = [];
				this.onRefresh();
			},
			// 设备列表分页
			loadMore() {
				if (this.refreshing) {
					this.blist = [];
					this.refreshing = false;
				}
				const that = this;
				let data = {
					pageNum: that.pageNum,
					pageSize: that.pageSize,
				}
				that.loading = true;
				that.$base.request1('manager/equipment/list' + '/' + this.areaId, 'GET', data)
					.then(res => {
						that.loading = false;
						if (res.data.data && res.data.data.length > 0) {
							var arr = res.data.data
							for (var i = 0; i < arr.length; i++) {
								console.log(arr[i].portState)
								if (arr[i].portState) {
									if (that.areaType == 0) {
										arr[i]["dknumber"] = arr[i].portState.split(',')
									} else {
										arr[i]["dknumber"] = arr[i].portState.split(',')
										arr[i]["dknumber1"] = arr[i].doorState
									}

								} else {
									arr[i]["dknumber"] = []
								}

								console.log(arr[i]["dknumber"])
							}

							that.blist = that.blist.concat(arr);
							that.pageNum += 1;
						} else {
							that.finished = true;
						}
					})
					.catch(err => {

					})
			},
			onRefresh() {
				// 清空列表数据
				this.finished = false;
				this.pageNum = 1
				// 重新加载数据
				// 将 loading 设置为 true，表示处于加载状态
				this.loading = true;
				this.loadMore();
			},
			showclose() {
				this.feilv = false
			},
			//备注信息展开
			bbtn() {
				if (this.beitype == 0) {
					this.beitype = 1
				} else if (this.beitype == 1) {
					this.beitype = 0
				}
			},
			//删除充电区
			delbtn() {
				this.$base.request1('manager/area' + '/' + this.areaId, 'DELETE')
					.then(res => {
						if (res.data.code == 200) {
							uni.showToast({
								title: '删除成功',
								duration: 2000,
							});
							this.blackbtn()
						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
							return
						}

					})
					.catch(err => {

					})
			},
			//清除坐标
			czgo() {
				this.gdshow = false;
				uni.showModal({
					title: '提示',
					content: '坐标清除后，在用户扫码上电时会重新上传，确认操作吗？',
					success: function (res2) {
						if (res2.confirm) {
							this.$base.request1('manager/area/location' + '/' + this.areaId, 'PUT')
								.then(res => {
									if (res.data.code == 200) {
										uni.showToast({
											title: '重置成功',
											duration: 2000,
										});
										// this.blackbtn()
									} else {
										uni.showToast({
											title: res.data.msg,
											duration: 2000,
											icon: "error"
										});
										return
									}
							
								})
								.catch(err => {
							
								})
						} else if (res2.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			},
			//刷新设备信息
			shuabtn() {

				let data = {
					deviceId: this.sbdeviceId
				}
				this.$base.request1('manager/equipment/reloadSimI', 'DELETE', data)
					.then(res => {
						if (res.data.code == 200) {
							this.timer = 3
							this.Verification = false; //点击button改变v-if的状态
							let auth_timer = setInterval(() => { //定时器设置每秒递减
								this.timer--; //递减时间
								if (this.timer <= 0) {
									this.$base.request1('manager/equipment' + '/' + this.sbid, 'GET')
										.then(res => {
											this.host = {}
											this.equipment = {}
											if (res.data.data.host) {
												this.host = res.data.data.host[0]
											}
											if (res.data.data.equipment) {
												this.equipment = res.data.data.equipment[0]
											}
										})
										.catch(err => {

										})
									this.Verification = true; //60s时间结束还原v-if状态并清除定时器
									clearInterval(auth_timer)
									// this.hkshow = false
								}
							}, 1000)

						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
							return
						}
					})
					.catch(err => {

					})

			},
			dnobtn(deviceId) {
				uni.navigateTo({
					url: '../port_management/port_management?deviceId=' + deviceId
				});
			},
			rembtn() {
				let data = {
					id: this.remid,
					remark: this.upremarks
				}
				this.$base.request1('manager/equipment/editRemark', 'POST', data)
					.then(res => {
						if (res.data.code == '200') {
							this.remshow = false
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
							});
							this.blist = [];
							this.onRefresh();
						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
						}
					})
					.catch(err => {

					})
			},
			//修改备注
			uprem(id, remarks) {
				this.remid = id
				this.upremarks = remarks
				this.remshow = true
			},
			//组网
			zwbtn(id) {
				this.$base.request1('manager/equipment/combinationNet/' + id, 'GET')
					.then(res => {
						if (res.data.code == '200') {
							uni.showToast({
								title: '操作成功',
								duration: 2000,
							});
							this.shuxin()
						} else {
							uni.showToast({
								title: res.data.msg,
								duration: 2000,
								icon: "error"
							});
						}
					})
					.catch(err => {

					})
			},

		}
	}
</script>

<style lang="scss" scoped>
	.main {
		width: 100%;

		/deep/.van-list__finished-text {
			line-height: 500upx;
		}

		/deep/.van-tabs {
			&__wrap {
				border-bottom: 0.5upx solid #dddddd;
				margin-bottom: 15upx;
			}

			&__line {
				width: 120upx;
				background-color: #4c96eb;
			}
		}

		.hand {
			width: 100%;
			background-color: #4B98ED;
			height: 62upx;
			font-size: 30upx;
			font-family: PingFang SC Bold, PingFang SC Bold-Bold;
			font-weight: 700;
			text-align: center;
			line-height: 62upx;
			color: #ffffff;
			position: relative;

			image {
				width: 22upx;
				height: 39upx;
				position: absolute;
				left: 31upx;
				top: 11upx;
			}
		}

		.show {
			width: 100%;
			box-sizing: border-box;

			/deep/.van-popup {
				border-radius: 16upx;
			}

			.sone {
				width: 100%;
				height: 330upx;
				background-color: #4b98ED;
				margin-bottom: 270upx;

				.sonefoot {
					width: 686upx;
					border-radius: 8upx;
					box-shadow: 0upx 2upx 9upx 0upx rgba(22, 22, 22, 0.1);
					background-color: #FFFFFF;
					box-sizing: border-box;
					margin: 0 auto;

					.sfone {
						width: 100%;
						box-sizing: border-box;
						display: flex;
						justify-content: space-between;
						padding: 29upx 24upx;
						border-bottom: 1upx solid #d1d1d1;

						image {
							width: 28.16upx;
							height: 17.92upx;
							margin-top: 50upx;
						}

						.sfoneleft {

							.sfoneleftfirst {
								font-size: 32upx;
								font-family: PingFang SC Bold, PingFang SC Bold-Bold;
								font-weight: 700;
								color: #333333;
								width: 500upx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
							}

							.sfoneleftsun {
								font-size: 25upx;
								font-family: PingFang SC Bold, PingFang SC Bold-Bold;
								color: #757575;
								font-weight: 400;
								width: 500upx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;

							}

							.sfoneleftsun1 {
								font-size: 25upx;
								font-family: PingFang SC Bold, PingFang SC Bold-Bold;
								color: #757575;
								font-weight: 400;
								width: 500upx;
								word-break: break-all;
							}
						}

						.sfoneright {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #333333;
						}
					}

					.sftwo {
						width: 100%;
						box-sizing: border-box;
						display: flex;
						justify-content: space-between;
						padding: 30upx 23upx 29upx 24upx;

						.sftwoleft {
							.sftwotap {
								display: flex;
								align-items: center;

								.stxt {
									width: 170upx;
									font-size: 28upx;
									font-family: PingFang SC Medium, PingFang SC Medium-Medium;
									font-weight: 500;
									color: #333333;
									margin-left: 20upx;
									line-height: 45upx;
								}

								.sleftone {
									background-color: #4BED4F;
									width: 60upx;
									text-align: center;
									font-size: 20upx;
									color: #fff;
									padding: 10upx 0;
									border-radius: 10upx;
								}

								.slefttwo {
									background-color: #FF0000;
									width: 60upx;
									text-align: center;
									font-size: 20upx;
									color: #fff;
									padding: 10upx 0;
									border-radius: 10upx;
								}

								.sleftthree {
									width: 14upx;
									height: 14upx;
									background-color: #4BED4F;
									border-radius: 50%;
									margin-left: 10upx;
									margin-right: 10.5upx;
								}

								/** 0=空闲 */
								.port0 {
									background-color: #40D851;
									border-color: #40D851;
								}

								/** 1=充电中 */
								.port1 {
									background-color: #CDCDCD;
									border-color: #CDCDCD;
								}

								/** 2=未充占用 */
								.port2 {
									background-color: #BC12ED;
									border-color: #BC12ED;
								}

								/** 3=充满占用 */
								.port3 {
									background-color: #0103FD;
									border-color: #0103FD;
								}

								/** 4=端口故障 */
								.port4 {
									background-color: #E40C00;
									border-color: #E40C00;
								}

								/** 5=浮充 */
								.port5 {
									background-color: #06F9E0;
									border-color: #06F9E0;
								}

								/** 6=存储器损坏 */
								.port6 {
									background-color: #005BAC;
									border-color: #005BAC;
								}

								/** 7=安全门卡住 */
								.port7 {
									background-color: #d3ac2b;
									border-color: #d3ac2b;
								}

								/** 8=保险丝烧断 */
								.port8 {
									background-color: #3e3e32;
									border-color: #3e3e32;
								}

								/** 9=继电器粘连 */
								.port9 {
									background-color: #7bbfea;
									border-color: #7bbfea;
								}

								/** 10=门磁芯片损坏 */
								.port10 {
									background-color: #FDF204;
									border-color: #FDF204;
								}

								/** 13=预检-负载短路 */
								.port13 {
									background-color: #c77eb5;
									border-color: #c77eb5;
								}

								/** 15=刷卡芯片损坏故障 */
								.port15 {
									background-color: #8B3626;
									border-color: #8B3626;
								}

								/** 88=绑定端口 */
								.port88 {
									background-color: #ffac93;
									border-color: #ffac93;
								}

								/** 99=禁用端口 */
								.port99 {
									background-color: #610000;
									border-color: #610000;
								}
							}

							.slzhan {
								margin: 0 auto;
								text-align: center;

								.slzhanone {
									color: #838383;
								}

								.slzhantwo {
									margin: 5upx auto;

									image {
										width: 30.8upx;
										height: 19.6upx;
									}

									width: 30.8upx;
									height: 19.6upx;
								}
							}
						}

						.sftworight {
							.srbtn {
								width: 128upx;
								height: 48upx;
								border-radius: 8upx;
								font-size: 24upx;
								font-family: PingFang SC Bold, PingFang SC Bold-Bold;
								font-weight: 700;
								text-align: center;
								line-height: 48upx;
								color: #ffffff;
								background-color: #4B98ED;
								margin-bottom: 18upx;
							}
						}
					}
				}

				.stwo {
					width: 100%;
					margin-bottom: 150upx;
					margin-top: 50upx;

					/deep/.van-cell {
						line-height: 42upx;
					}

					/deep/.van-cell:not(:last-child)::after {
						border-bottom: 0upx solid #FFFFFF;
					}


					.stwotap {

						width: 686upx;
						// height: 88upx;
						border-radius: 8upx;
						box-shadow: -1upx 4upx 9upx 0upx rgba(66, 66, 66, 0.17);
						margin: 10upx auto;

						.stwotaphand {
							display: flex;
							align-items: center;
							box-sizing: border-box;
							padding: 0 23upx;
							padding-bottom: 5upx;
							padding-top: 18upx;

							.stapleft {
								width: 31.5%;
								display: flex;
								align-items: center;

								.stfone {
									background-color: #4BED4F;
									width: 60upx;
									text-align: center;
									font-size: 20upx;
									color: #fff;
									border-radius: 10upx;
								}

								.stfone1 {

									background-color: #FF0000;
									width: 60upx;
									text-align: center;
									font-size: 20upx;
									color: #fff;
									border-radius: 10upx;
								}

								.stftwo {
									font-size: 28upx;
									font-family: PingFang SC Bold, PingFang SC Bold-Bold;
									font-weight: 700;
									color: #333333;
									margin-left: 10upx;
								}
							}

							.dknum {
								width: 27%;
								display: flex;
								box-sizing: border-box;
								flex-wrap: wrap;

								.sleftthree {
									width: 14upx;
									height: 14upx;
									background-color: #4BED4F;
									border-radius: 50%;
									margin: 5upx 0upx;
									margin-left: 8upx;
								}

								/** 0=空闲 */
								.port0 {
									background-color: #40D851;
									border-color: #40D851;
								}

								/** 1=充电中 */
								.port1 {
									background-color: #CDCDCD;
									border-color: #CDCDCD;
								}

								/** 2=未充占用 */
								.port2 {
									background-color: #BC12ED;
									border-color: #BC12ED;
								}

								/** 3=充满占用 */
								.port3 {
									background-color: #0103FD;
									border-color: #0103FD;
								}

								/** 4=端口故障 */
								.port4 {
									background-color: #E40C00;
									border-color: #E40C00;
								}

								/** 5=浮充 */
								.port5 {
									background-color: #06F9E0;
									border-color: #06F9E0;
								}

								/** 6=存储器损坏 */
								.port6 {
									background-color: #005BAC;
									border-color: #005BAC;
								}

								/** 7=安全门卡住 */
								.port7 {
									background-color: #d3ac2b;
									border-color: #d3ac2b;
								}

								/** 8=保险丝烧断 */
								.port8 {
									background-color: #3e3e32;
									border-color: #3e3e32;
								}

								/** 9=继电器粘连 */
								.port9 {
									background-color: #7bbfea;
									border-color: #7bbfea;
								}

								/** 10=门磁芯片损坏 */
								.port10 {
									background-color: #FDF204;
									border-color: #FDF204;
								}

								/** 13=预检-负载短路 */
								.port13 {
									background-color: #c77eb5;
									border-color: #c77eb5;
								}

								/** 15=刷卡芯片损坏故障 */
								.port15 {
									background-color: #8B3626;
									border-color: #8B3626;
								}

								/** 88=绑定端口 */
								.port88 {
									background-color: #ffac93;
									border-color: #ffac93;
								}

								/** 99=禁用端口 */
								.port99 {
									background-color: #610000;
									border-color: #610000;
								}
							}

							.stapz {
								font-size: 22upx;
								font-family: PingFang SC Bold, PingFang SC Bold-Bold;
								font-weight: 700;
								color: #333333;
								width: 28%;
								overflow: hidden;
								white-space: nowrap;
								text-overflow: ellipsis;

								.color1 {
									background-color: red;
									color: #fff;
									border-radius: 8upx;
									padding: 2upx 6upx;
								}

								.color2 {
									background-color: #FFA73E;
									color: #fff;
									border-radius: 8upx;
									padding: 2upx 6upx;
								}

								.color3 {
									background-color: blue;
									color: #fff;
									border-radius: 8upx;
									padding: 2upx 6upx;
								}

								.color4 {
									background-color: green;
									color: #fff;
									border-radius: 8upx;
									padding: 2upx 6upx;
								}
							}

							.stapright {
								display: flex;
								align-items: center;

								.imgone {
									font-size: 20upx;
									background-color: #4B98ED;
									border-radius: 10upx;
									padding: 0 4upx;
									color: #fff;
									// width: 38upx;
									// height: 18upx;
								}

								.imgtwo {
									width: 32upx;
									height: 28upx;
									margin-left: 2upx;
								}
							}
						}

						.stwotapfoot {
							display: flex;
							padding: 0 23upx;
							font-size: 22upx;
							font-family: PingFang SC Bold, PingFang SC Bold-Bold;
							font-weight: 700;
							color: #333333;
							padding-bottom: 10upx;

							.color1 {
								background-color: red;
								color: #fff;
								border-radius: 8upx;
								padding: 2upx 6upx;
							}

							.color2 {
								background-color: #FFA73E;
								color: #fff;
								border-radius: 8upx;
								padding: 2upx 6upx;
							}

							.color3 {
								background-color: blue;
								color: #fff;
								border-radius: 8upx;
								padding: 2upx 6upx;
							}

							.color4 {
								background-color: green;
								color: #fff;
								border-radius: 8upx;
								padding: 2upx 6upx;
							}

							.color5 {
								background-color: #FFB2B2;
								color: #fff;
								border-radius: 8upx;
								padding: 2upx 6upx;
							}

							.color6 {
								background-color: #CEE5FF;
								color: #fff;
								border-radius: 8upx;
								padding: 2upx 6upx;
							}

							.dno {
								width: 140upx;
								background-color: #4B98ED;
								text-align: center;
								border-radius: 10upx;
								color: #fff;
							}
						}

						.dktap {
							padding-left: 20upx;
							display: flex;

							.dknum1 {
								width: 27%;
								display: flex;
								box-sizing: border-box;
								flex-wrap: wrap;
								font-size: 28upx;
								font-family: PingFang SC Bold, PingFang SC Bold-Bold;
								font-weight: 700;
								color: #333333;
								align-items: center;

								.sleftthree {
									width: 14upx;
									height: 14upx;
									background-color: #4BED4F;
									border-radius: 50%;
									margin: 5upx 0upx;
									margin-left: 8upx;
								}

								/** 0=空闲 */
								.port0 {
									background-color: #40D851;
									border-color: #40D851;
								}

								/** 1=充电中 */
								.port1 {
									background-color: #CDCDCD;
									border-color: #CDCDCD;
								}

								/** 2=未充占用 */
								.port2 {
									background-color: #BC12ED;
									border-color: #BC12ED;
								}

								/** 3=充满占用 */
								.port3 {
									background-color: #0103FD;
									border-color: #0103FD;
								}

								/** 4=端口故障 */
								.port4 {
									background-color: #E40C00;
									border-color: #E40C00;
								}

								/** 5=浮充 */
								.port5 {
									background-color: #06F9E0;
									border-color: #06F9E0;
								}

								/** 6=存储器损坏 */
								.port6 {
									background-color: #005BAC;
									border-color: #005BAC;
								}

								/** 7=安全门卡住 */
								.port7 {
									background-color: #d3ac2b;
									border-color: #d3ac2b;
								}

								/** 8=保险丝烧断 */
								.port8 {
									background-color: #3e3e32;
									border-color: #3e3e32;
								}

								/** 9=继电器粘连 */
								.port9 {
									background-color: #7bbfea;
									border-color: #7bbfea;
								}

								/** 10=门磁芯片损坏 */
								.port10 {
									background-color: #FDF204;
									border-color: #FDF204;
								}

								/** 13=预检-负载短路 */
								.port13 {
									background-color: #c77eb5;
									border-color: #c77eb5;
								}

								/** 15=刷卡芯片损坏故障 */
								.port15 {
									background-color: #8B3626;
									border-color: #8B3626;
								}

								/** 88=绑定端口 */
								.port88 {
									background-color: #ffac93;
									border-color: #ffac93;
								}

								/** 99=禁用端口 */
								.port99 {
									background-color: #610000;
									border-color: #610000;
								}
							}
						}

						.zuwang {
							width: 100%;
							display: flex;
							flex-direction: row-reverse;
							padding: 0 38upx;
							box-sizing: border-box;
							padding-bottom: 10upx;

							.zwone {
								width: 140upx;
								background-color: #4B98ED;
								text-align: center;
								border-radius: 10upx;
								color: #fff;
							}
						}

					}
				}
			}

			.tannei {
				width: 630upx;
				background-color: #FFFFFF;

				.tnhand {
					width: 100%;
					height: 64upx;
					background-color: #4B98ED;
					align-items: center;

					.tntxt {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						color: #ffffff;
						line-height: 64upx;
						text-align: center;
						position: relative;
					}

					image {
						width: 25upx;
						height: 25upx;
						position: absolute;
						top: 19upx;
						right: 18upx;
					}
				}

				.cdk {
					width: 100%;
					display: flex;
					box-sizing: border-box;
					padding: 20upx 0;
					flex-wrap: wrap;

					.cdkwai {
						width: 140upx;
						background-color: #40D851;
						text-align: center;
						padding: 20upx 0;
						color: #fff;
						margin-left: 16upx;
						margin-bottom: 10upx;
						border-radius: 15upx;

					}

					.cdkwai1 {
						width: 136upx;
						background-color: #40D851;
						text-align: center;
						padding: 16upx 0;
						color: #fff;
						margin-left: 16upx;
						margin-bottom: 10upx;
						border-radius: 15upx;
						border: 2upx solid #3e3e32;
						box-shadow: 0upx 6upx 16upx 0upx #3e3e32;
					}

					/** 0=空闲 */
					.port0 {
						background-color: #40D851;
					}

					/** 1=充电中 */
					.port1 {
						background-color: #CDCDCD;
					}

					/** 2=未充占用 */
					.port2 {
						background-color: #BC12ED;
					}

					/** 3=充满占用 */
					.port3 {
						background-color: #0103FD;
					}

					/** 4=端口故障 */
					.port4 {
						background-color: #E40C00;
					}

					/** 5=浮充 */
					.port5 {
						background-color: #06F9E0;
					}

					/** 6=存储器损坏 */
					.port6 {
						background-color: #005BAC;
					}

					/** 7=安全门卡住 */
					.port7 {
						background-color: #d3ac2b;
					}

					/** 8=保险丝烧断 */
					.port8 {
						background-color: #3e3e32;
					}

					/** 9=继电器粘连 */
					.port9 {
						background-color: #7bbfea;
					}

					/** 10=门磁芯片损坏 */
					.port10 {
						background-color: #FDF204;
					}

					/** 13=预检-负载短路 */
					.port13 {
						background-color: #c77eb5;
					}

					/** 15=刷卡芯片损坏故障 */
					.port15 {
						background-color: #8B3626;
					}

					/** 88=绑定端口 */
					.port88 {
						background-color: #ffac93;
					}

					/** 99=禁用端口 */
					.port99 {
						background-color: #610000;
					}

				}

				.cdkkat {
					width: 100%;
					display: flex;
					justify-content: center;

					.cdkkatone {
						width: 200upx;
						padding: 20upx 0;
						margin-left: 30upx;
						text-align: center;
						background-color: #4B98ED;
						color: #fff;
						border-radius: 25upx;
						margin-bottom: 15upx;
					}

					.cdkkatone2 {
						width: 200upx;
						padding: 20upx 0;
						margin-left: 30upx;
						text-align: center;
						background-color: #910012;
						color: #fff;
						border-radius: 25upx;
						margin-bottom: 15upx;
					}

					.cdkkatone1 {
						width: 200upx;
						padding: 20upx 0;
						margin-left: 30upx;
						text-align: center;
						background-color: #969696;
						color: #fff;
						border-radius: 25upx;
						margin-bottom: 15upx;
					}

					.cdkkattwo {
						width: 200upx;
						padding: 20upx 0;
						margin-left: 30upx;
						text-align: center;
						background-color: #40D851;
						color: #fff;
						border-radius: 25upx;
						margin-bottom: 15upx;
					}

					.cdkkattwo1 {
						width: 200upx;
						padding: 20upx 0;
						margin-left: 30upx;
						text-align: center;
						background-color: #969696;
						color: #fff;
						border-radius: 25upx;
						margin-bottom: 15upx;
					}
				}

				.tnshow {
					margin: 0 20upx;
					padding: 15upx 0;
					border-bottom: 0.5upx solid #dddddd;
					font-size: 28upx;
					font-family: PingFang SC Medium, PingFang SC Medium-Medium;
					font-weight: 500;
					color: #333333;
					display: flex;
					justify-content: space-between;
					align-items: center;

					.tnshowone {
						width: 100upx;
						background-color: #4B98ED;
						color: #fff;
						border-radius: 10upx;
						padding: 8upx 0;
						text-align: center;
					}

					.tnshowone1 {
						width: 100upx;
						background-color: #999999;
						color: #fff;
						border-radius: 10upx;
						padding: 8upx 0;
						text-align: center;
					}
				}

				.tnfoot {
					box-sizing: border-box;
					padding: 40upx 0upx 40upx 45upx;

					.tntap {
						width: 100%;
						display: flex;
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						color: #333333;
						margin-bottom: 15upx;

						.tntapleft {
							width: 200upx;
							text-align: left;
						}

						.tntaoright {
							text-align: left;
						}

						.tcolor0 {
							background-color: #1c84c6;
							padding: 2upx 18upx;
							border-radius: 20upx;
							color: #fff;
						}

						.tcolor00 {
							background-color: #1ab394;
							padding: 2upx 18upx;
							border-radius: 20upx;
							color: #fff;
						}

						.tcolor88 {
							background-color: #f8ac59;
							padding: 2upx 18upx;
							border-radius: 20upx;
							color: #fff;
						}

						.tcolor99 {
							background-color: #ed5565;
							padding: 2upx 18upx;
							border-radius: 20upx;
							color: #fff;
						}
					}
				}

				.tnone {
					.tnonetap {
						width: 100%;
						box-sizing: border-box;
						padding: 20upx 70upx;
						display: flex;
						align-items: center;

						.toneleft {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #333333;
						}

						input {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #999999;
							width: 150upx;
							margin-left: 10upx;
							border-bottom: 1upx solid #e5e5e5;
						}
					}

					.tnoneshow {
						width: 100%;
						display: flex;
						align-items: center;

						.tnonetxt {
							width: 170upx;
							text-align: right;
							font-size: 28upx;
							color: #6c6c6c;
						}

						input {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #999999;
							width: 400upx;
							border: 1upx solid #d8d8d8;
							margin: 20upx auto;
							padding: 10upx;
						}

						textarea {
							font-size: 28upx;
							height: 90upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #999999;
							width: 400upx;
							border: 1upx solid #d8d8d8;
							margin: 20upx auto;
							padding: 10upx;
						}
					}
				}

				.tntwo {
					width: 305upx;
					height: 64upx;
					border-radius: 8upx;
					background-color: #4B98ED;
					font-size: 28upx;
					font-family: PingFang SC Bold, PingFang SC Bold-Bold;
					font-weight: 700;
					text-align: center;
					line-height: 64upx;
					margin: 20upx auto;
					color: #ffffff;
				}

				.gdtype {
					display: flex;
					justify-content: center;

					.gdshowbtn {

						width: 128upx;
						height: 48upx;
						border-radius: 8upx;
						font-size: 24upx;
						font-family: PingFang SC Bold, PingFang SC Bold-Bold;
						font-weight: 700;
						text-align: center;
						line-height: 48upx;
						color: #ffffff;
						background-color: #4B98ED;
						margin: 38upx 18upx;
					}
				}


			}

			.sfour {
				width: 686upx;

				.stwohand {
					width: 100%;
					height: 64upx;
					background-color: #4B98ED;
					font-size: 32upx;
					font-family: PingFang SC Bold, PingFang SC Bold-Bold;
					font-weight: 700;
					line-height: 64upx;
					color: #ffffff;
					box-sizing: border-box;
					padding: 0 34upx;
					display: flex;
					justify-content: space-between;
					align-items: center;

					image {
						width: 25upx;
						height: 25upx;
					}
				}

				.stwofoot {
					width: 100%;
					box-sizing: border-box;
					padding: 43upx 36upx;

					.sfone {
						width: 100%;
						display: flex;
						margin-bottom: 20upx;

						.sfoneleft {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #333333;
						}

						.sfoneright {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 700;
							color: #333333;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
							width: 500upx;
						}
					}

					.sftwo {
						width: 100%;

						.sftwohand {
							font-size: 24upx;
							font-family: PingFang SC Bold, PingFang SC Bold-Bold;
							font-weight: 700;
							color: #333333;
							margin-bottom: 26upx;
						}

						.sftwofoot {
							width: 100%;
							display: flex;

							.montleft {
								font-size: 28upx;
								font-family: PingFang SC Medium, PingFang SC Medium-Medium;
								font-weight: 500;
								color: #333333;
								width: 30%;
							}

							.montright {
								width: 100%;

								.montone {
									font-size: 28upx;
									font-family: PingFang SC Bold, PingFang SC Bold-Bold;
									font-weight: 700;
									color: #333333;
									margin-bottom: 30upx;
								}

							}
						}
					}
				}
			}
		}

	}
</style>